
<script type="text/x-red" data-template-name="mqtt out">
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">
    </div>
    <div class="form-row">
        <label for="node-input-clientId"><i class="fa fa-globe"></i> <span
                data-i18n="mqtt.label.broker"></span></label>
        <select id="node-input-clientId" style="width:70%;">
        </select>
    </div>
    <div class="form-row">
        <label for="node-input-topic"><i class="fa fa-tasks"></i> <span data-i18n="common.label.topic"></span></label>
        <input type="text" id="node-input-topic" data-i18n="[placeholder]common.label.topic">
    </div>
    <div class="form-row">
        <label for="node-input-qos"><i class="fa fa-empire"></i> <span data-i18n="mqtt.label.qos"></span></label>
        <select id="node-input-qos" style="width:125px !important">
            <option value=""></option>
            <option value="0">0</option>
            <option value="1">1</option>
            <option value="2">2</option>
        </select>
        &nbsp;&nbsp;<i class="fa fa-history"></i>&nbsp;<span data-i18n="mqtt.retain"></span> &nbsp;<select
            id="node-input-retain" style="width:125px !important">
        <option value=""></option>
        <option value="false" data-i18n="mqtt.false"></option>
        <option value="true" data-i18n="mqtt.true"></option>
    </select>
    </div>

    <div class="form-tips"><span data-i18n="mqtt.tip"></span></div>


</script>

<script type="text/javascript">
    RED.nodes.registerType('mqtt out', {
        category: 'network',
        name:"推送MQTT",
        defaults: {
            name: {value: ""},
            topic: {value: ""},
            qos: {value: ""},
            retain: {value: ""},
            clientId: {value: "", required: true}
        },
        color: "#d8bfd8",
        inputs: 1,
        outputs: 0,
        icon: "bridge.svg",
        align: "right",
        label: function () {
            return this.name || this.topic || "推送MQTT";
        },
        labelStyle: function () {
            return this.name ? "node_label_italic" : "";
        },
        oneditsave: function () {
            this.clientId = $("#node-input-clientId").val();
        },
        oneditprepare: function () {
            let me = this;
            $.ajax({
                url: RED.settings.apiBaseUrl + "/network/config/_query/no-paging?paging=false&where=type=MQTT_CLIENT"
            }).then(function (res) {
                if (res.result) {
                    $(res.result).each(function () {
                        $("#node-input-clientId").append($("<option>").val(this.id).text(this.name))
                    })
                }
                $("#node-input-clientId").val(me.clientId);
            })
        }
    });
</script>
